<template>
	<view :style="{padding:`${$safeh}px 32rpx `}" class="mybox">
		<topbg></topbg>
		<infobox class="mainbox" @changeinfo='changeinfo'></infobox>
		<setting @changeinfo='changeinfo'></setting>

		<u-popup :show="show" @close="close" round=10 :closeOnClickOverlay='true' @open="open">
			<infopop @cancelclick='cancelclick' @confirmclick='confirmclick'>
			</infopop>
		</u-popup>
	</view>
</template>

<script>
	import setting from '../../components/setting.vue';
	import infobox from '../../components/infobox.vue';
	import infopop from '../../components/infopop.vue';
	import topbg from '../../components/topbg.vue';
	export default {
		components: {
			setting,
			infobox,
			infopop,
			topbg
		},
		data() {
			return {
				show: false,
				
			};
		},
		methods: {
			close() {
				this.show = false
			},
			open() {

			},
			
			//子组件的传值
			changeinfo(e) {
				this.show = e
			},
			cancelclick(e){
				this.show = e
			},
			confirmclick(e){
				this.show = e
			},
		}
	}
</script>

<style lang="scss">
	page {
		
		.mainbox{
			margin-top: -170rpx;
			z-index: 9;
			background-color: #fff;
			
		}
		@mixin flex {
			display: flex;
			align-items: center;
		}

		background-color: rgb(245, 245, 245);

		.mybox {
			@include flex flex-direction: column;
		}
	}
</style>